<template>
    <section class="after-sale-detail-main base-main">
      <!--头部-->
      <div class="head">
        <!--<p class="fs14">等待商家处理</p>-->
        <!--<p class="fs10">请耐心等待...</p>-->

        <!--仅退款-->
        <p class="fs14">等待商家处理</p>
        <p class="fs10">还剩{{day}}天{{hour}}时{{minute}}分</p>

        <!--拒绝-->
        <!--<p class="fs14">商家拒绝退货退款</p>-->
        <!--<p class="fs10">请与商家协商处理</p>-->

        <!--成功-->
        <!--<p class="fs14">退款成功</p>-->
        <!--<p class="fs10">2018-08-24 10:23:45</p>-->
      </div>
      <!--头部-->

      <!--退款金额-->
      <!--<div class="refund-box fs14 bgcFFF">-->
        <!--<p class="line-bottom">-->
          <!--退款金额-->
          <!--<span class="flr colorF54E4E">￥80.00</span>-->
        <!--</p>-->
        <!--<p>-->
          <!--退回微信-->
          <!--<span class="flr color7A7B82">￥80.00</span>-->
        <!--</p>-->
      <!--</div>-->
      <!--退款金额-->

      <!--说明-->
      <div class="explain-text bgcFFF">
        <div class="explain-detail line-bottom">
          <p class="fs13">
            如果商家同意，请按照给出的退货地址退货
          </p>
          <p class="fs13">
            如果商家拒绝，请与商家协商
          </p>
        </div>

        <!--<div class="explain-detail line-bottom">-->
          <!--<p class="fs13">-->
            <!--如果商家同意或超时未处理，系统将退款给您-->
          <!--</p>-->
          <!--<p class="fs13">-->
            <!--如果商家拒绝，您可以修改退款申请后再次发起，商家会重新处理-->
          <!--</p>-->
        <!--</div>-->

        <!--<div class="explain-detail line-bottom">-->
          <!--<p class="fs13">-->
            <!--商家已同意换货，请按照以下退货地址寄回商品-->
          <!--</p>-->
          <!--<p class="fs12 color7A7B82">-->
            <!--收货人：店铺指定人员-->
          <!--</p>-->
          <!--<p class="fs12 color7A7B82">-->
            <!--联系电话：15912345678-->
          <!--</p>-->
          <!--<p class="fs12 color7A7B82">-->
            <!--退货地址：广州市花都区新华街道迎宾大道116号索弗大厦二楼-->
          <!--</p>-->
          <!--<p class="fs12 color7A7B82">-->
            <!--邮政编码：425711-->
          <!--</p>-->
          <!--<p class="fs12 color7A7B82" style="line-height: 20px;">-->
            <!--注意事项：请将退货商品包装好，且商品不影响二次销售；<span class="colorF54E4E">请勿发平邮或到付件</span>，商品寄出后，需及时在每笔退款操作上填写物流信息，以免退款超时关闭-->
          <!--</p>-->
        <!--</div>-->

        <div class="btn text-r">
          <span class="text-c fs14 color45454D inline-block">撤销申请</span>
          <span class="text-c fs14 color45454D inline-block" @click="toAfterSaleLogistics">填写物流</span>
        </div>

        <!--<div class="btn text-r">-->
        <!--<span class="text-c fs14 color45454D inline-block">撤销申请</span>-->
        <!--</div>-->

        <!--<div class="btn text-r">-->
          <!--<span class="text-c fs14 color45454D inline-block">确认收货</span>-->
        <!--</div>-->
      </div>
      <!--说明-->

      <!--待售后产品信息-->
      <div class="product-box mt10 bgcFFF">
        <p class="title fs14 text-l color45454D pdlr15 line-bottom">
          换货信息
        </p>

        <AfterTypePorduct :product="product"></AfterTypePorduct>

        <div class="msg-box ">
          <div class="msg line-top fs12 color7A7B82 bgcFFF">
            <p>换货原因：七天无理由退换</p>
            <p>申请时间：2018-04-04 16:40:30</p>
            <p>退款编号：90020180404164030</p>
          </div>
        </div>
      </div>
      <!--待售后产品信息-->
      <Loading :show="isLoading"></Loading>
    </section>
</template>

<script type="text/ecmascript-6">
  import Loading from '../../components/Loading.vue'
  import AfterTypePorduct from '../../components/AfterTypePorduct.vue'

  export default {
    components:{
      Loading,AfterTypePorduct
    },
    data() {
      return {
        isLoading:false,
        product:{
          path:'https://ss0.baidu.com/73x1bjeh1BF3odCf/it/u=138126325,1485620701&fm=85&s=7FAB2EC3909A35D01E299C1A030010D2',
          name:'商品名称',
          model:'7332',
          number:2
        },//商品信息
        day:0,//天数
        hour:0,//小时
        minute:0,//分钟
        second:0,//秒
        time:'2019/5/10 12:00:00',//倒计时时间
      }
    },
    created(){
      this.countDown(this.time)
    },
    methods: {
      //填写物流信息
      toAfterSaleLogistics(){
        this.$router.push({
          path:'/index/web/afterSaleLogistics',
          query:{id:'1'}
        })
      },
      countDown(timer){
        let oDate = new Date();//获取日期对象
        let oldTime = oDate.getTime();//现在距离1970年的毫秒数
        let newDate = new Date(timer);
        let newTime = newDate.getTime();//2019年距离1970年的毫秒数
        let second = Math.floor((newTime - oldTime) / 1000);//未来时间距离现在的秒数
        let day = Math.floor(second / 86400);//整数部分代表的是天；一天有24*60*60=86400秒 ；
        second = second % 86400;//余数代表剩下的秒数；
        let hour = Math.floor(second / 3600);//整数部分代表小时；
        second %= 3600; //余数代表 剩下的秒数；
        let minute = Math.floor(second / 60);
        second %= 60;
        this.day = this.formattingTime(day);
        this.hour = this.formattingTime(hour);
        this.minute = this.formattingTime(minute);
        this.second = this.formattingTime(second);
      },
      formattingTime(n){
        return n >= 0 && n < 10 ? '0' + n : '' + n;
      }
    },
  }
</script>

<style scoped lang="scss">
  @import '../../assets/css/afterSaleDetail.scss';
</style>
